<div class="something"></div>


<div class="ViewData">
    <div class="loader-content">
        <div class="view-Data-sort">
            <span class="column"> <input type="checkbox"> 全选</span>
            <span class="column-goods"> 商品名称 </span>
            <span class="column">单价</span>
            <span class="column">数量</span>
            <span class="column">小计</span>
            <span class="column">操作</span>
        </div>
    </div>

</div>
<script src="./javascripts/jQuery.js"></script>
<script>
    console.log(localStorage.getItem('Data'));
    $(function () {
        var Data = (function () {
            // 如果购物车数据存在,那么我们就把购物车数据变成对象； 
            // 如果购物车数据解释时报错我们就重新创建新的的购物车数据; 
            if (localStorage.getItem("Data")) {
                var data = null;
                try {
                    data = JSON.parse(localStorage.getItem("Data"));

                } catch (e) {
                    data = {};
                }

                return data;
            } else {
                return {};
            }
        })();
        console.log(Data);
        // 根据Data的数据渲染页面; 
        var html = "";

        // 拼接html结构 : 
        for (var attr in Data) {
            html += `<div class="t-body">
                      <div class="item-list">
                            <div class="item-form">
                                  <img src="${Data.pic}">
                                  <div class="good-name">￥${Data.name}</div>
                                  <div class="prcie">￥${Data.price}</div>
                                  <div>1</div>
                                  <div>208</div>
                                  <div class="option">
                                        <a href="javascript:void(0)">删除</a>
                                  </div>
                            </div>
                      </div>
                </div>`
        }


        $(".loader-content").append(
            html
        );


        $(".option").on("click","a",function(){
            $(this).parent().parent().parent().remove();
        })

    })
</script>